page {
    width: 100vw;
    height: 100vh;
}

.img {
    width: 90rpx;
    position: fixed;
    bottom: 30rpx;
    right: 40rpx;
    z-index: 400;
}

.container {
    width: 100vw;
    // height: 100vh;

    .article_item {
        display: flex;
        flex-direction: column;
        width: 100vw;
        background-color: white;

        .info_container {
            width: 100vw;
            display: flex;
            align-items: center;
            height: 120rpx;

            .user_img_container {
                height: 80rpx;
                display: flex;
                margin: 0 20rpx 0 25rpx;

                image {
                    border-radius: 40rpx;
                    height: 80rpx;
                }
            }

            .user_container {
                display: flex;
                flex-direction: column;
                height: 80rpx;
                justify-content: space-around;

                .user_name {
                    color: black;
                    // font-weight: bolder;
                    font-size: 32rpx;
                }

                .time {
                    color: var(--themecolor);
                    font-size: 24rpx; //字体大小
                }
            }

        }

        .content {
            display: block;
            margin: 20rpx 25rpx 20rpx 25rpx;
            overflow-wrap: break-word;
            font-size: 28rpx; //字体大小
        }

        .img_container {
            display: flex;
            width: 100vw;
            padding: 0 25rpx;
            margin: 10rpx 0;

            .img_1 {
                //一张或者两张图片
                width: ~'calc((100vw - 50rpx) / 2 - 10rpx)';
                height: 200rpx;
                border-radius: 15rpx;
                margin-right: 15rpx;
            }

            .img_2 {
                //三张或三张以上图片的样式
                width: ~'calc((100vw - 50rpx) / 3 - 10rpx)';
                height: 200rpx;
                border-radius: 15rpx;
                margin-right: 15rpx;
            }
        }

        .video_container {
            display: flex;
            width: 100vw;
            padding: 0 25rpx;
            margin: 10rpx 0;

            video {
                width: ~'calc((100vw - 50rpx) / 2 - 10rpx)';
                height: 200rpx;
                border-radius: 15rpx;
            }
        }

        .tip {
            display: flex;
            width: 100vw;
            height: 100rpx;
            justify-content: space-around;

            .item_container {
                display: flex;
                height: 100rpx;
                width: ~'calc((100vw - 50rpx) / 3)';
                align-items: center;
                justify-content: center;

                image {
                    height: 40rpx;
                    margin-right: 20rpx;
                }

                .word {
                    font-weight: bolder;
                    height: 40rpx;
                    font-size: 28rpx; //字体大小
                }
            }
        }
    }
}
